/**
 * 产品信息列表
 * 
 * 
 * */ 
import React, { useState,useEffect,useCallback } from 'react';
import Header from '@/component/layout/Header/Header';
import Tab from './Tab';
import SelectItem from './Select';
import List from './List';
import './style.less';
import { Link } from 'react-router-dom';
import { configwx } from '@/util/share'

const img2 = require('../../assests/img/sousuo.png');
const pageSize = 20;
let tab = 0; // tab 缓存，用于切换路由的时候还是当前的tab


const ProductInfo = (props) => {
  const [ tabType, setTabType ] = useState(tab); // 0 产品知识  1医学知识
  // const [ type, setType ] = useState(1); //0：精神科；1：神经内科2：消化科3：其它科室 
  // const [ pageIndex, setPageIndex ] = useState(1)
  const [param, setParam] = useState({pageIndex:1, pageSize, type:0})

  // const param = useMemo(() => {
  //   return { pageIndex, pageSize: 10, type }
  // }, [pageIndex, type])

  const update = useCallback(() => {
    setParam({...param, pageIndex:param.pageIndex+1})
  }, [param])

  const setTabF = useCallback((e) => {
    tab = e;
    setTabType(e)
    setParam({...param, pageIndex:1})
  }, [param])

  const setTypeF = useCallback((e) => {
    setParam({...param, type:e, pageIndex:1})
    // setType(e)
    // setPageIndex(1)
  }, [param])

  useEffect(()=>{
    configwx(
      '豪森药业', '产品信息'
    )
  })


  return <>
    <Header
      // right={<img className="icon-header-sousuo" src={img2} alt="" />}
      right={<Link to="/search"><img className="icon-header-sousuo" src={img2} alt="" /></Link>}
      center={'产品信息'}
    />
    <div className="global-content ProductInfo-box">
      <Tab setTabType={setTabF} tab={tab}/>
      <SelectItem setType={setTypeF}/>
      <List tabType={tabType} param={param} update={update}/>
    </div>
  </>

}


export default React.memo(ProductInfo)